﻿<template>
	<div>
		<el-row>
			<el-col :span="10">
			<el-input placeholder="请输入文件名" v-model="fileName">
				<template slot="prepend">文件名:</template>
			</el-input>
			</el-col>
			<el-button type="primary" @click="getfile" >导出</el-button>
		</el-row>
		
        <mavon-editor v-model="value" style="height: 100%" @save="saveone" ref="md" @imgAdd="$imgAdd"></mavon-editor>
        
    </div>
    
</template>

<script>
	import { Client } from '../../js/common';
	import vTable from '../charts/table.vue';
	export default {
		data() {
			return {
				value:'',
				fileName:'',
				fileList:[]
			}
		},
		mounted: function() {
			//生命周期
			
		},
		computed: {
			//计算属性
			
		},
		methods: { //函数
			saveone (val, render) {
                let _this = this;
				let client = Client.NewOSS();
				
				async function put () {
				  	try {
				    	let result = await client.put(_this.fileName, new Buffer(_this.value));
				    	console.log(result);
				   	} catch (err) {
				     	console.log (err);
				   	}
				}
				put();
           	},
			getfile:function(){
				let _this = this;
				
				let client = Client.NewOSS();
				
				async function getBuffer () {
				  try {
				    let result = await client.get(_this.fileName);
				    console.log(result.content.toString());
				    _this.value = result.content.toString()
				  } catch (e) {
				    console.log(e);
				  }
				}
				getBuffer();
			},
			// 绑定@imgAdd event
	        $imgAdd(pos, $file){
	        	let _this = this;
				console.log($file);
	            // 第一步.将图片上传到服务器.

	           	let base64 = $file.miniurl.split(',')[1];
	           	let fileType = $file.miniurl.split(';')[0].split(':')[1];
	           	console.log(base64);
	           	console.log(fileType);
	           	let blob = this.toBlob(base64,fileType);
	           	console.log(blob);
	           
	           	let reader = new FileReader();
			    reader.readAsArrayBuffer(blob);
			    reader.onload = function (event) {
			    	
			        // 配置
			        let client = Client.NewOSS();
			        
			        // 文件名
			        var date = new Date();
			        var time = ''+date.getFullYear()+date.getMonth()+1+date.getDate();
			        var storeAs = 'Uploads/file/'+time+'/'+date.getTime()+'.'+blob.type.split('/')[1];
			        
			        // arrayBuffer转Buffer
			        var buffer = new Buffer(event.target.result);
			        
			        // 上传
			        client.put(storeAs, buffer).then(function(result){
			           console.log(result);
			           _this.$refs.md.$img2Url(pos,result.url);
			        }).catch(function(err){
			            console.log(err);
			        });
			    }
	        },
	       	toBlob:function (urlData,fileType){
		        let bytes=window.atob(urlData),
		            n=bytes.length,
		            u8arr=new Uint8Array(n);
		        while(n--){
		            u8arr[n]=bytes.charCodeAt(n);
		        }
		        return new Blob([u8arr],{type:fileType});
		    }
		},
		created: function() {
			
		},
		update:function(){
			
		},
		watch: {
		
		}

	}
</script>

<style>
</style>